<template>
    <div id="GovernmentMana">
        
        <div class="top_content">
            <div class="title">
                <h1>企业碳排放</h1>
                <p>Government carbon management</p>
            </div>
        </div>
        
        <div class="mid_content clearfix">
            <div class="mid_content_left">
                <el-row class="tac">
                    <el-col :span="18">
                    <h5 class="mb-2">企业碳排放</h5>
                    <el-menu default-active="1" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" > 
                        <el-menu-item index="1" @click="treeIndex = '1'">
                            <el-icon><ChatDotRound /></el-icon>
                            <span>碳盘查</span>
                        </el-menu-item>
                        <el-menu-item index="2" @click="treeIndex = '2'">
                            <el-icon><Calendar /></el-icon>
                            <span>碳监测计划编制</span>
                        </el-menu-item>
                        <el-menu-item index="3" @click="treeIndex = '3'">
                            <el-icon><DocumentChecked /></el-icon>
                            <span>碳达峰实施方案</span>
                        </el-menu-item>
                        <el-menu-item index="4" @click="treeIndex = '4'">
                            <el-icon><Document /></el-icon>
                            <span>碳减排规划</span>
                        </el-menu-item>
                        <el-menu-item index="5" @click="treeIndex = '5'">
                            <el-icon><PartlyCloudy /></el-icon>
                            <span>碳足迹认证</span>
                        </el-menu-item>
                        <el-menu-item index="6" @click="treeIndex = '6'">
                            <el-icon><Finished /></el-icon>
                            <span>碳管理体系搭建</span>
                        </el-menu-item>
                    </el-menu>
                    </el-col>
                </el-row>
            </div>
            <div class="mid_content_right">
                <div class="content1" v-if="treeIndex == '1'">
                    <div class="leftTitle">碳盘查</div>
                    <div class="childTitle"><el-icon><EditPen /></el-icon> 数据填报 
                        <el-button color="#626aef" size="small"  :dark="isDark" @click="table_edit_all_1_show = true" v-if="!table_edit_all_1_show">展开</el-button>
                        <el-button color="#626aef" size="small"  :dark="isDark" @click="table_edit_all_1_show = false" v-else>收起</el-button>
                    </div>
                    <div class="table_edit_all table_edit_all_1" v-if="table_edit_all_1_show">
                        <div class="childTitle"><el-icon><Document /></el-icon> 基本信息</div>
                        <div class="message_edit message_edit_1">
                            <el-form :inline="true" :model="formInline" class="demo-form-inline"  :label-width="240">
                                <el-form-item label="产值（万元）">
                                    <el-input v-model="formInline.user" placeholder="产值（万元）" style="width:260px"/>
                                </el-form-item>
                                 <el-form-item label="增加值（万元）">
                                    <el-input v-model="formInline.user" placeholder="增加值（万元）" style="width:260px" />
                                </el-form-item>
                                 <el-form-item label="企业综合能源消费量（吨标煤）">
                                    <el-input v-model="formInline.user" placeholder="企业综合能源消费量（吨标煤）"  style="width:260px"/>
                                </el-form-item>
                                 <el-form-item label="企业工业生产能源消费量（吨标煤）">
                                    <el-input v-model="formInline.user" placeholder="企业工业生产能源消费量（吨标煤）"  style="width:260px"/>
                                </el-form-item>
                                <!-- <el-form-item>
                                    <el-button type="primary" @click="onSubmit">提交</el-button>
                                </el-form-item> -->
                            </el-form>
                        </div><div class="childTitle"><el-icon><Document /></el-icon> 工业生产过程</div>
                        <div class="message_edit message_edit_1">
                            <el-form  :inline="true" :model="formInline" class="demo-form-inline" :label-width="240">
                                <el-form-item label="产值（万元）">
                                    <el-input v-model="formInline.user" placeholder="产值（万元）" style="width:260px"/>
                                </el-form-item>
                                 <el-form-item label="增加值（万元）">
                                    <el-input v-model="formInline.user" placeholder="增加值（万元）" style="width:260px"/>
                                </el-form-item>
                                 <el-form-item label="企业综合能源消费量（吨标煤）">
                                    <el-input v-model="formInline.user" placeholder="企业综合能源消费量（吨标煤）" style="width:260px"/>
                                </el-form-item>
                                 <el-form-item label="企业工业生产能源消费量（吨标煤）">
                                    <el-input v-model="formInline.user" placeholder="企业工业生产能源消费量（吨标煤）" style="width:260px"/>
                                </el-form-item>
                                <el-form-item label="产值（万元）">
                                    <el-input v-model="formInline.user" placeholder="产值（万元）" style="width:260px"/>
                                </el-form-item>
                                 <el-form-item label="增加值（万元）">
                                    <el-input v-model="formInline.user" placeholder="增加值（万元）" style="width:260px"/>
                                </el-form-item>
                                 <el-form-item label="企业综合能源消费量（吨标煤）">
                                    <el-input v-model="formInline.user" placeholder="企业综合能源消费量（吨标煤）" style="width:260px"/>
                                </el-form-item>
                                 <el-form-item label="企业工业生产能源消费量（吨标煤）">
                                    <el-input v-model="formInline.user" placeholder="企业工业生产能源消费量（吨标煤）" style="width:260px"/>
                                </el-form-item>
                                <el-form-item>
                                    <el-button type="primary" @click="onSubmit">提交</el-button>
                                </el-form-item>
                            </el-form>
                        </div>
                    </div>
                    <div class="childTitle"><el-icon><EditPen /></el-icon> 补充数据表配置
                        <el-button color="#626aef" size="small"  :dark="isDark" @click="table_edit_all_2_show = true" v-if="!table_edit_all_2_show">展开</el-button>
                        <el-button color="#626aef" size="small"  :dark="isDark" @click="table_edit_all_2_show = false" v-else>收起</el-button>
                    </div>
                    <div class="table_edit_all"  v-if="table_edit_all_2_show">
                        <div class="childTitle"><el-icon><Document /></el-icon> 基本信息</div>
                        <div class="message_edit message_edit_1">
                            <el-form  :model="formInline" class="demo-form-inline"  :label-width="240">
                                <el-form-item label="行业" prop="type">
                                    <el-checkbox-group v-model="formInline.type">
                                        <el-checkbox label="石化" name="type" />
                                        <el-checkbox label="化工" name="type" />
                                        <el-checkbox label="建材" name="type" />
                                        <el-checkbox label="钢铁" name="type" />
                                        <el-checkbox label="有色" name="type" />
                                        <el-checkbox label="造纸" name="type" />
                                        <el-checkbox label="电力" name="type" />
                                        <el-checkbox label="航空" name="type" />
                                    </el-checkbox-group>
                                </el-form-item>
                                <el-form-item label="内容" prop="type">
                                    <el-checkbox-group v-model="formInline.type">
                                        <el-checkbox label="合成氮生产" name="type" />
                                        <el-checkbox label="甲醇生产" name="type" />
                                        <el-checkbox label="其他化工产品生产" name="type" />
                                    </el-checkbox-group>
                                </el-form-item>
                                <el-form-item label="设施" prop="type">
                                    <el-checkbox-group v-model="formInline.type">
                                        <el-checkbox label="既有设施" name="type" />
                                        <el-checkbox label="新增设施" name="type" />
                                    </el-checkbox-group>
                                </el-form-item>
                                <el-form-item label="车间" prop="type">
                                    <el-checkbox-group v-model="formInline.type">
                                        <el-checkbox label="分厂或车间1" name="type" />
                                        <el-checkbox label="分厂或车间2" name="type" />
                                    </el-checkbox-group>
                                </el-form-item>

                            </el-form>
                        </div>
                        <div class="childTitle"><el-icon><Document /></el-icon> 能源作为原材料产生的排量</div>
                        <div class="message_edit message_edit_1">
                            <el-form  :model="formInline" class="demo-form-inline" label-position="top" :label-width="240">
                                
                                <el-form-item label="碳输入-化工企业原材料品种" prop="type">
                                    <el-checkbox-group v-model="formInline.type">
                                        <el-checkbox :label="item" name="type" v-for="item in alltypes" :key="item" style="width:100px"/>
                                    </el-checkbox-group>
                                </el-form-item>
                                <el-form-item label="碳输入-化工企业原材料品种" prop="type">
                                    <el-checkbox-group v-model="formInline.type">
                                        <el-checkbox :label="item" name="type" v-for="item in alltypes" :key="item" style="width:100px"/>
                                    </el-checkbox-group>
                                </el-form-item>
                                <el-form-item label="碳输入-化工企业原材料品种" prop="type">
                                    <el-checkbox-group v-model="formInline.type">
                                        <el-checkbox :label="item" name="type" v-for="item in alltypes" :key="item" style="width:100px"/>
                                    </el-checkbox-group>
                                </el-form-item>
                                <el-form-item>
                                    <el-button type="primary" @click="onSubmit">提交</el-button>
                                </el-form-item>
                            </el-form>
                        </div>
                    </div>
                    <div class="childTitle"><el-icon><EditPen /></el-icon> 补充数据填报
                        <el-button color="#626aef" size="small"  :dark="isDark" @click="table_edit_all_3_show = true" v-if="!table_edit_all_3_show">展开</el-button>
                        <el-button color="#626aef" size="small"  :dark="isDark" @click="table_edit_all_3_show = false" v-else>收起</el-button>
                    </div>
                    <div class="table_edit_all"  v-if="table_edit_all_3_show">
                    </div>
                    <div class="childTitle"><el-icon><EditPen /></el-icon> 报告查看 
                        <el-button color="#626aef" size="small"  :dark="isDark" @click="table_edit_all_4_show = true" v-if="!table_edit_all_4_show">展开</el-button>
                        <el-button color="#626aef" size="small"  :dark="isDark" @click="table_edit_all_4_show = false" v-else>收起</el-button>
                    </div>
                    <div class="table_edit_all"  v-if="table_edit_all_4_show">
                    </div>
                </div> 
                <div class="content1" v-if="treeIndex == '2'">
                    <div class="leftTitle">碳监测计划编制</div>
                    <div class="">
                        <div class="title"><el-icon color="#409EFC"><QuestionFilled /></el-icon> 什么是碳监测？</div>
                        <p>碳监测是指通过综合观测、数值模拟、统计分析等手段，获取温室气体排放强度、环境中浓度、生态系统碳汇以及对生态系统影响等碳源汇状况及其变化趋势信息，以服务于应对气候变化研究和管理工作的过程。主要监测对象为《京都议定书》和《多哈修正案》中规定控制的7种人为活动排放的温室气体，包括二氧化碳（CO2）、甲烷（CH4）、氧化亚氮（N2O）、氢氟化碳（HFCs）、全氟化碳（PFCs）、六氟化硫（SF6）和三氟化氮（NF3）。</p>
                        
                    </div>
                </div>
                <div class="content1" v-if="treeIndex == '3'">
                    <div class="leftTitle">碳达峰实施方案</div>
                    <div class="content1_detail">
                        <p></p>
                        <p></p>
                        <p></p>
                        <p></p>
                        <p></p>
                        <p></p>
                        <p></p>
                    </div>
                </div>
                <div class="content1" v-if="treeIndex == '4'">
                    <div class="leftTitle">碳减排规划</div>
                    <div class="content1_detail">
                        <el-timeline style="margin-left:-50px">
                            <el-timeline-item timestamp="控总量" placement="top">
                                <el-card>
                                    <!-- <h4>Update Github template</h4> -->
                                    <p>“需求侧改革”，提升效率，减少浪费</p>
                                </el-card>
                            </el-timeline-item>
                            <el-timeline-item timestamp="调结构" placement="top">
                                <el-card>
                                    <!-- <h4>Update Github template</h4> -->
                                    <p>加强非化石能源开发利用</p>
                                </el-card>
                            </el-timeline-item>
                            <el-timeline-item timestamp="碳市场" placement="top">
                                <el-card>
                                    <!-- <h4>Update Github template</h4> -->
                                    <p>以市场化方式降低减排成本</p>
                                </el-card>
                            </el-timeline-item>
                            <el-timeline-item timestamp="碳技术" placement="top">
                                <el-card>
                                    <!-- <h4>Update Github template</h4> -->
                                    <p>固碳、吸碳</p>
                                </el-card>
                            </el-timeline-item>
                        </el-timeline>
                    </div>
                </div>
                <div class="content1" v-if="treeIndex == '5'">
                    <div class="leftTitle">碳足迹认证</div>
                    <div class="content1_detail">
                        <div class="title"><el-icon color="#409EFC"><QuestionFilled /></el-icon> 什么是“碳足迹”</div>
                        <p>碳足迹指的是由企业机构、活动、产品或个人引起的温室气体排放的集合。温室气体排放渠道主要有：交通运输、食品生产和消费、能源使用以及各类生产过程。通常所有温室气体排放用二氧化碳当量（CO2）来表示。</p>
                        <p>其中“碳”，就是石油、煤炭、木材等由碳元素构成的自然资源；碳耗用得多，导致全球变暖的元凶二氧化碳也制造得多。</p>
                        <p>制造企业的供应链一般包括了采购、生产、仓储和运输，其中仓储和运输会产生大量的二氧化碳。</p>

                        <div class="title"><el-icon color="#409EFC"><QuestionFilled /></el-icon> 什么是产品碳足迹？</div>
                        <p>产品碳足迹(Product Carbon Footprint)，是指某个产品在其整个生命周期内的各种GHG排放，即从原材料一直到生产（或提供服务）、分销、使用和处置/再生利用等所有阶段的GHG排放。其范畴包括二氧化碳（CO2）、甲烷（CH4）、和氮氧化物（N2O）等温室气体。</p>
                        <p>随着越来越多的企业开始关注低碳制造以应对来自政府、社会及公众的压力，展示企业自身的社会责任。众多行业内优秀企业开始着手从产品源头设计开始，减少对产品整个生命周期的GHG(温室气体：Greenhouse Gas)排放量。</p>
                    
                        <div class="title"><el-icon color="#409EFC"><QuestionFilled /></el-icon> 企业如何进行碳足迹认证？</div>
                        <p>第一，我们要选择一家有相关资质的第三方机构，目前市场上鱼龙混杂，请大家一定要擦亮眼睛；</p>
                        <p>第二，第三方公司会进驻企业进行相关规划，成立工作组，行程工作方案；</p>
                        <p>第三，会依照相关标准和通用国际通用准则，进行辩解核定；</p>
                        <p>第四，会对企业相关数据进行收集并分析；</p>
                        <p>第五，进行产品碳足迹的计算；</p>
                        <p>第六，进行不确定分析；</p>
                        <p>第七，给出结论，通报碳足迹并公布减排量；</p>
                        <p>第八，给出企业节能减排建议；</p>
                        <p>第九，发布报告、证书等。</p>
                    </div>
                </div>
                <div class="content1" v-if="treeIndex == '6'">
                    <div class="leftTitle">碳管理体系搭建</div>
                    <div class="content1_detail">
                        <p>碳资产管理包括综合管理、技术管理、实物管理和价值管理。</p>
                        <p>综合管理包括规划、制度、流程、培训、咨询、风险等的管理，是碳资产管理的基础；</p>
                        <p>▼ 技术管理包括减排技术、能效技术、低碳解决方案等的管理，是碳资源转变为碳资产的技术支撑;</p>
                        <p>▼ 实物管理包括碳盘查、碳综合利用、碳排放等的管理，是价值管理的基础；</p>
                        <p>▼ 价值管理包括CCER 项目开发、碳交易以及碳的金融衍生品，如碳债券、碳信用等的管理，价值管理体现的是碳资产价值实现。</p>
                        <p>在国家开展碳交易试点工作的7个省市中，电力行业被列为重点控排行业之一，随着其配额稀缺性的逐年增强，配额价格也会随之上涨，因此，电力企业做好碳资产管理显得尤为重要，即可以避免支付高额成本购买配额，同时又可以在碳排放交易市场中获益。</p>
                        <p>由于电力企业拥有良好的数据监测系统，同时在清洁发展机制市场下已培养了熟练专业的碳资产管理技巧，因此，在国内碳市场背景下进行碳资产管理是极为有优势的。其要素包括：设立碳资产管理机构；建立温室气体报送系统；开发自愿减排项目；开展碳交易和履约。</p>
                        <el-timeline style="margin-left:-50px">
                            <el-timeline-item timestamp="设立碳资产管理机构" placement="top">
                                <el-card>
                                    <!-- <h4>Update Github template</h4> -->
                                    <p>该机构的主要任务是针对企业碳资产开发、碳市场分析、碳配额管理、排放报告编制、质量控制、审核风险控制、碳交易运作等进行实时跟踪和反馈企业管理过程信息，提出解决方案。</p>
                                    <p>同时，机构还应该根据重点功能节点设置数据分析、报告编制、审核质控、交易管理等子部门，这些部门将分别与企业其他专业部门进行信息对接与方案评估改进，通过跨职能部门的水平整合和优化合作，提升综合管理能力以获得减少碳排放的最大潜力</p>
                                </el-card>
                            </el-timeline-item>
                            <el-timeline-item timestamp="建立温室气体报送系统" placement="top">
                                <el-card>
                                    <!-- <h4>Update Github template</h4> -->
                                    <p>在该系统中可以查询企业专业部门上报的全部生产活动数据信息以及相关活动记录，包括生产活动及管理沟通中所产生的关键问题，实时统计企业碳排放量及碳资产管理情况，通过软件分析配额管理等经营策略，规范碳配额交易审批体系，在完整输出企业碳盘查报告结果的同时，保证了管理过程的可追溯性，完善碳资产管理过程的质控体系。</p>
                                </el-card>
                            </el-timeline-item>
                            <el-timeline-item timestamp="开发自愿减排项目" placement="top">
                                <el-card>
                                    <!-- <h4>Update Github template</h4> -->
                                    <p>由于电力企业在传统CDM项目开发时期就已培养了一批专业人员，而国内自愿减排项目开发与CDM项目开发又有很多相似之处，因此，电力企业可以结合自身资源特点投资开发不同类型的CCER项目，同时建立自愿减排量内部调剂系统，通过区域范围内优化资源配置，完成现温室气体控排目标，降低减排成本。</p>
                                </el-card>
                            </el-timeline-item>
                            <el-timeline-item timestamp="开展碳交易和企业履约" placement="top">
                                <el-card>
                                    <!-- <h4>Update Github template</h4> -->
                                    <p>通过碳监测和碳盘查，企业将根据持有配额和产生的排放量进行碳交易，进而完成履约任务，同时提高碳资产价值获得收益。期间，在报送系统的支撑下，通过深入了解自身的碳排放量和减排成本，梳理出潜在的减排途径，并对不同碳减排途径的减排潜力、成本效益等进行详细评估和测算，管理机构可以先进行碳资产统筹交易模拟操作。</p>
                                    <p>若企业无法独立完成该部分的操作，可以联合金融机构，其将通过专业的交易手段，指导企业在合适的价格买卖碳排放权，让企业从短期操作中获利，避免长期持有可能面临的碳价贬值，同时，金融机构还将为企业提供其他模式的服务。</p>
                                </el-card>
                            </el-timeline-item>
                        </el-timeline>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>


export default {
  data() {
    return {
        tableData:[{
                date: '2016-05-03',
                name: 'Tom',
                address: 'No. 189, Grove St, Los Angeles',
            },
            {
                date: '2016-05-02',
                name: 'Tom',
                address: 'No. 189, Grove St, Los Angeles',
            },
            {
                date: '2016-05-04',
                name: 'Tom',
                address: 'No. 189, Grove St, Los Angeles',
            },
            {
                date: '2016-05-01',
                name: 'Tom',
                address: 'No. 189, Grove St, Los Angeles',
            },],
        formInline:{
            user: '',
            region: '',
            type:[],
        },
        treeIndex:1,
        alltypes:['乙醇','烟煤','褐煤','洗精煤','其他洗煤','煤制品','焦炭','原油','燃料油','汽油','柴油','一般煤油',
        '石油焦','液化天然气','液化石油气','焦油','粗苯','其他石油制品','炼厂干气','焦炉煤气','高炉煤气','转炉煤气','电石炉炉气',
        '其他煤气','天然气','二甲苯','冰纯酸',],
        table_edit_all_1_show:true,
        table_edit_all_2_show:true,
        table_edit_all_3_show:true,
        table_edit_all_4_show:true,
        
    }
  },
  methods:{
    load(){

    },
    toDetail(index){
      this.$router.push({path:'articleRead',query:{back:'/'}});
    },
    toMore(){

    },
    onSubmit(){

    },
  },
  mounted(){
    window.scrollTo(0,0);
  }
}
</script>


<style scoped>
#AboutUs{
    position: relative;
}
.top_content{
    width:100%;
    height:480px;
    background: url("../../assets/a.png");
    background-size: cover !important;
    background-repeat: round !important;
    text-align: center;
    overflow:hidden;

}
.top_content .title{
    margin-top: 60px;
    color: #333;
}
.mid_content{
    width: 1080px;
    position:relative;
    left: 50%;
    margin-left:-540px;
    top:-300px;
    min-height: 600px;
    -webkit-box-shadow: 0 11px 24px rgba(0, 17, 54, 0.58);
    -moz-box-shadow: 0 11px 24px rgba(0, 17, 54, 0.58);
    box-shadow: 0 11px 24px rgba(0, 17, 54, 0.58);
    background: #ffffff;
    padding: 30px 40px;
    box-sizing: border-box;
}
.mid_content_left{
    width: 30%;
    float: left;
}
.mid_content_right{
    width: 70%;
    float: left;
}
.leftTitle{
    line-height: 40px;
    font-size: 18px;
    color: #333;
    font-weight: bold;
    margin-bottom:20px;
}
.childTitle{
    color:#333;
    font-size: 16px;
    line-height: 40px;
}
.table_edit_all{
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    background: #fdfdfd;
}
.table_edit_all .childTitle{
    color:#666;
    line-height: 40px;
}
.message_edit{
    border: 1px solid #efefef;
    padding:10px 10px 0;
}
.content1_detail p{
    color: #666;
    font-size: 16px;
    text-indent: 20px;
}
</style>